<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

<ui:composition template="/WEB-INF/templates/master.xhtml">
	<ui:define name="content">

	<!--  Inicio Dialogo Cumplimiento de documentacion -->
	<p:dialog header="Cumplimiento de Documentacion del Personal" id="dialogCumplimiento" modal="true" resizable="false" 
			widgetVar="dlgCumplimiento"  appendToBody="true"  width="600" height="600" hideEffect="fade" >
			
		<p:panel  styleClass="panel-azul">
		<h:panelGrid columns="3" width="100%">
		<p:outputLabel value="Datos del Colaborador"/><h:outputLabel value="" /><h:outputLabel value="" />
		<h:outputText value="#{cumplimientoMB.personalSelected.idPersona.nombreCompleto}" />
		<!--h:outputLabel value="Cumplimiento #{cumplimientoMB.porcentaje*100}" /><p:progressBar value="#{cumplimientoMB.porcentaje*100}"  labelTemplate="{value}%" displayOnly="true" style="width:100px" ></p:progressBar-->
		</h:panelGrid>
		<h:form id="form">
		<!-- p:contextMenu for="lstCumplimiento" widgetVar="cMenu">     
        <p:menuitem value="Edit Cell" icon="ui-icon-search" onclick="wgLstCumplimiento.showCellEditor();return false;"/>    
        <p:menuitem value="Hide Menu" icon="ui-icon-close" onclick="cMenu.hide()"/>    
  		</p:contextMenu-->
		<p:growl id="msjCumplimiento" showDetail="true" />
		<p:dataTable  id="lstCumplimiento" value="#{cumplimientoMB.cumplimientos}"  var="c"  rowIndexVar="idx" editable="true"  rowKey="#{c}" widgetVar="wgLstCumplimiento" >
		
		 <p:ajax event="rowEdit" listener="#{cumplimientoMB.rowEditListener}" update=":form:msjCumplimiento" /> 
		<p:column headerText="Item"><h:outputLabel value="#{idx+1}" /></p:column>
		<p:column headerText="Documento">
		<h:outputText value="#{c.idDocumento.descripcion}" style="width:400px"/>
		 </p:column>
		
		<p:column headerText="Fecha Presentacion">
		<h:outputText value="#{c.fechaPresentacion}" id="fechaPres">
		<f:convertDateTime pattern="dd-MM-yyyy" />
		</h:outputText>
		</p:column>
		<p:column headerText="Verificados" >
		 <p:cellEditor>  
                <f:facet name="output"><h:selectBooleanCheckbox value="#{c.ok}"  disabled="true"/></f:facet>  
                <f:facet name="input">  
                    <h:selectBooleanCheckbox value="#{c.ok}" label="Verificados" onchange="rowChanged(this,#{idx})" />
                </f:facet>  
           </p:cellEditor>  
		
		</p:column>
		
		<p:column>
<p:rowEditor />
</p:column>
		
		</p:dataTable>
		
		
		
		
		
		<br/>
		<h:panelGrid columns="4">
		<p:commandButton value="Salir" immediate="true" onclick="dlgCumplimiento.hide();" type="button"/>
		<ui:include src="/resources/includes/ajaxStatus.xhtml" />
		</h:panelGrid>
		</h:form>
		</p:panel>
	
	</p:dialog>
	<!--  FIN Dialogo Cumplimiento de documentacion -->
	
	
	
	
	<h:form id="formBusqueda">
	<p:growl id="msjBusqueda" showDetail="true" />
	<f:validateBean disabled="true"> 
	<p:panel  header="Validar Cumplimiento de Documentacion" style="width:960px;height:510px" styleClass="panel-azul" >
		
		<p:panel style="width:850px" styleClass="panel-azul" header="Buscar al personal">
		<h:panelGrid columns="5">
		<h:outputLabel value="Código Personal" />
		<h:outputLabel value="Apellido Paterno" />
		<h:outputLabel value="Apellido Materno" />
		<h:outputLabel value="Nombres" />
		<h:outputLabel value="Estado" />
		<h:inputText value="#{personalBusquedaMB.personalConsulta.codigoPersonal}" />
		<h:inputText value="#{personalBusquedaMB.personalConsulta.idPersona.apellidoPaterno}"/>
		
		<h:inputText value="#{personalBusquedaMB.personalConsulta.idPersona.apellidoMaterno}" />
		
		<h:inputText value="#{personalBusquedaMB.personalConsulta.idPersona.nombres}" />
		
		<h:selectOneMenu value="#{personalBusquedaMB.personalConsulta.estado}">
		<f:selectItems  value="#{parametroMB.estadoPersonal}"/>
		</h:selectOneMenu>
	</h:panelGrid>
	</p:panel>
	<h:panelGrid columns="5" id="botonesBusqueda"> 
	<p:commandButton value="Buscar" action="#{personalBusquedaMB.consultarPersonal}" update="dtBusqueda" />
	<p:commandButton value="Verificar Cumplimientos" onclick="if(checkSelectedRow(dtBusquedaWidget)==false)return false;" action="#{cumplimientoMB.cargarCumplimiento}" oncomplete="dlgCumplimiento.show();" update=":dialogCumplimiento" />
	<ui:include src="/resources/includes/ajaxStatus.xhtml" />
	</h:panelGrid>
	
	<p:panel style="width:850px;height:330px;" styleClass="panel-azul" header="Resultado de Búsqueda">
	
					<p:dataTable id="dtBusqueda" emptyMessage="No hay registros" value="#{personalBusquedaMB.lstPersonal}"  var="per"  rowKey="#{per}" selection="#{cumplimientoMB.personalSelected}" widgetVar="dtBusquedaWidget" paginator="true" paginatorPosition="bottom" paginatorAlwaysVisible="false" rows="8">
						<p:column headerText="Código"><h:outputLabel value="#{per.codigoPersonal}" /></p:column>
						<p:column headerText="Estado"><h:outputLabel value="#{per.estado}" /></p:column>
						<p:column headerText="Apellidos y Nombres"><h:outputLabel value="#{per.idPersona.apellidoPaterno} #{per.idPersona.apellidoMaterno} #{per.idPersona.nombres }" style="text-transform:uppercase;" /> </p:column>
						<p:column headerText="DNI"><h:outputLabel value="#{per.idPersona.nroDocumento}" /> </p:column>
						<p:column headerText="Cargo"></p:column>
						<p:column headerText="Elegir" selectionMode="single"></p:column>
					<!-- p:ajax event="rowSelectRadio" update=":#{p:component('botonesBusqueda')}" /-->	
					</p:dataTable>
	
	
	</p:panel>
	
	
	
	
	
	</p:panel>
	</f:validateBean> 
		</h:form>


		
 	<script type= "text/javascript">
	//<![CDATA[
	
function rowChanged(checkbox,rowIndex){
   var el=document.getElementById("form:lstCumplimiento:"+rowIndex+":fechaPres");
   if(checkbox.checked){
	 // $(el).html($.datepicker.formatDate('yy-mm-dd', new Date()));
	}
   else{
	 //  $(el).html("");
	   }
}
//]]>
</script>
		
	</ui:define>

</ui:composition>

</html>